<!-- directive:title 项目使用页面中大量文字数据展示/编辑样式 -->
<!-- directive:breadcrumb 文字数据展示/编辑 -->
<div class='panel-body'>
    <div class="show_data edit_data">
        <ul >
            <li style=" padding: 0; ">
                能量值获取成功后有效期为
                <input type="text" maxlength="2" w6>
                年，过期未使用的能量值自动扣除（每年清算时间为
                <select ng-model="yue" w6>
                    <option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option>
                    <option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option>
                    <option value="11">11</option><option value="12">12</option>
                </select>
                月
                <select ng-model="ri" w6>
                    <option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option>
                    <option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option>
                    <option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option>
                    <option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option>
                    <option value="21">21</option><option value="22">22</option><option value="23">23</option><option value="24">24</option><option value="25">25</option>
                    <option value="26">26</option><option value="27">27</option><option value="28">28</option><option value="29">29</option>
                    <option ng-if="yue!=2" value="30">30</option>
                    <option ng-if="yue==1||yue==3||yue==5||yue==7||yue==8||yue==10||yue==12" value="31">31</option>
                </select>
                日）。
                <span style="color:red">输入不合法</span>
            </li>
        </ul>
    </div>
    <div class="row">
        <div class="col-sm-8">
            <h6><kbd>举例</kbd> <span ng-click="kg = !kg">切换</span></h6>
            <div ng-hide=" kg ">
                <div class="show_data edit_data">
                    <label class="checkbox-inline i-switch">
                        <input type="checkbox" ng-model='obj[0].is_deleted'>
                        <i></i>
                    </label>
                    <div>签到：</div>
                    <ul ng-repeat="node in [obj[0].node[0]]">
                        <li>连续签到第1天-第5天，每日可获得<input type="text" ng-model="node.med_signonetofive" w6>能量值；</li>
                        <li>连续签到5天，额外获得<input type="text" ng-model="node.med_signfive" w6>能量值；</li>
                        <li>连续签到第6天-第30天，每日可获得<input type="text" ng-model="node.med_signsixtofifty" w6>能量值；</li>
                        <li>连续签到10天，额外获得<input type="text" ng-model="node.med_signten" w6>能量值；</li>
                        <li>连续签到20天，额外获得<input type="text" ng-model="node.med_signtwenty" w6>能量值；</li>
                        <li>连续签到30天，额外获得<input type="text" ng-model="node.med_signthirty" w6>能量值；</li>
                        <li>连续签到31天及以上，每日签到获得<input type="text" ng-model="node.med_signthirtymore" w6>能量值；</li>
                        <li>连续签到31天后每连续签到15天，额外获得<input type="text" ng-model="node.med_signthirtymore_fifteen" w6>能量值。</li>
                    </ul>
                </div>
                <div class="show_data edit_data">
                    <label class="checkbox-inline i-switch">
                        <input type="checkbox" ng-model='obj[1].is_deleted'>
                        <i></i>
                    </label>
                    <div>分享：</div>
                    <ul ng-repeat="node in [obj[1].node[0]]">
                        <li>每天成功分享小程序包括但不限于课程、套餐、活动等后，<br />每次可获得<input type="text" ng-model="node.med_share" w6>能量值，每日最多获得<input type="text" ng-model="node.med_sharecount" w6>次</li>
                    </ul>
                </div>
                <div class="show_data edit_data">
                    <label class="checkbox-inline i-switch">
                        <input type="checkbox" ng-model='obj[2].is_deleted'>
                        <i></i>
                    </label>
                    <div>活动奖励：</div>
                    <ul ng-repeat="node in [obj[2].node[0]]">
                        <li>每参加一个营销活动，均可获得<input type="text" ng-model="node.med_activity" w6>能量值</li>
                    </ul>
                </div>
                <div class="show_data edit_data">
                    <label class="checkbox-inline i-switch">
                        <input type="checkbox" ng-model='obj[3].is_deleted'>
                        <i></i>
                    </label>
                    <div>入场：</div>
                    <ul ng-repeat="node in [obj[3].node[0]]">
                        <li>每次入场成功可获得<input type="text" ng-model="node.med_admission" w6>能量值，每日最多获得<input type="text" ng-model="node.med_admissioncount" w6>次</li>
                    </ul>
                </div>
                <div class="show_data edit_data">
                    <label class="checkbox-inline i-switch">
                        <input type="checkbox" ng-model='obj[4].is_deleted'>
                        <i></i>
                    </label>
                    <div>销课：</div>
                    <ul ng-repeat="node in [obj[4].node[0]]">
                        <li> 每节课销课成功可获得<input type="text" ng-model="node.med_writeoff" w6>能量值</li>
                    </ul>
                </div>
                <div class="show_data edit_data">
                    <label class="checkbox-inline i-switch">
                        <input type="checkbox" ng-model='obj[5].is_deleted'>
                        <i></i>
                    </label>
                    <div>评论：</div>
                    <ul ng-repeat="node in [obj[5].node[0]]">
                        <li> 每节课评论成功可获得<input type="text" ng-model="node.med_comment" w6>能量值，如若输入文字可获得<input type="text" ng-model="node.med_commentwithwords" w6>能量值 </li>
                    </ul>
                </div>
                <div class="show_data edit_data">
                    <label class="checkbox-inline i-switch">
                        <input type="checkbox" ng-model='obj[6].is_deleted'>
                        <i></i>
                    </label>
                    <div>运动：</div>
                    <ul>
                        <li ng-repeat="node in obj[6].node">每天运动<input type="text" ng-model="node.med_motionminutes_start" w6>-<input type="text" ng-model="node.med_motionminutes_end" w6>分钟，每1分钟可获得<input type="text" ng-model="node.med_motion_per" w6>能量值 <del><i class="fa fa-minus-square"></i></del></li>
                        <li><i add class="fa fa-plus-square"></i>（每日22:00统计）</li>
                    </ul>
                </div>
                <div class="show_data edit_data">
                    <label class="checkbox-inline i-switch">
                        <input type="checkbox" ng-model='obj[7].is_deleted'>
                        <i></i>
                    </label>
                    <div>充值：</div>
                    <ul>
                        <li ng-repeat="node in obj[7].node">一次性充值<input type="text" ng-model="node.med_recharge_start" w6>-<input type="text" ng-model="node.med_recharge_end" w6>元，每1元实收金额可获得<input type="text" ng-model="node.med_recharge_per" w6>能量值 <del><i class="fa fa-minus-square"></i></del></li>
                        <li><i add class="fa fa-plus-square"></i></li>
                    </ul>
                </div>
                <div class="show_data edit_data">
                    <label class="checkbox-inline i-switch">
                        <input type="checkbox" ng-model='obj[8].is_deleted'>
                        <i></i>
                    </label>
                    <div>购买课程：</div>
                    <ul>
                        <li ng-repeat="node in obj[8].node">一次性消费<input type="text" ng-model="node.med_consume_start" w6>-<input type="text" ng-model="node.med_consume_end" w6>元，每1元实收金额可获得<input type="text" ng-model="node.med_consume_per" w6>能量值 <del><i class="fa fa-minus-square"></i></del></li>
                        <li><i add class="fa fa-plus-square"></i></li>
                    </ul>
                </div>
            </div>
            <div ng-hide=" ! kg ">
                <div class="show_data">
                    <div>签到：</div>
                    <ul ng-repeat="node in [obj[0].node[0]]">
                        <li>连续签到第1天-第5天，每日可获得{{node.med_signonetofive}}能量值；</li>
                        <li>连续签到5天，额外获得{{node.med_signfive}}能量值；</li>
                        <li>连续签到第6天-第30天，每日可获得{{node.med_signsixtofifty}}能量值；</li>
                        <li>连续签到10天，额外获得{{node.med_signten}}能量值；</li>
                        <li>连续签到20天，额外获得{{node.med_signtwenty}}能量值；</li>
                        <li>连续签到30天，额外获得{{node.med_signthirty}}能量值；</li>
                        <li>连续签到31天及以上，每日签到获得{{node.med_signthirtymore}}能量值；</li>
                        <li>连续签到31天后每连续签到15天，额外获得{{node.med_signthirtymore_fifteen}}能量值。</li>
                    </ul>
                </div>
                <div class="show_data">
                    <div>分享：</div>
                    <ul ng-repeat="node in [obj[1].node[0]]">
                        <li>每天成功分享小程序包括但不限于课程、套餐、活动等后，每次可获得{{node.med_share}}能量值，每日最多获得{{node.med_sharecount}}次</li>
                    </ul>
                </div>
                <div class="show_data">
                    <div>活动奖励：</div>
                    <ul ng-repeat="node in [obj[2].node[0]]">
                        <li>每参加一个营销活动，均可获得{{node.med_activity}}能量值</li>
                    </ul>
                </div>
                <div class="show_data">
                    <div>入场：</div>
                    <ul ng-repeat="node in [obj[3].node[0]]">
                        <li>每次入场成功可获得{{node.med_admission}}能量值，每日最多获得{{node.med_admissioncount}}次</li>
                    </ul>
                </div>
                <div class="show_data">
                    <div>销课：</div>
                    <ul ng-repeat="node in [obj[4].node[0]]">
                        <li> 每节课销课成功可获得{{node.med_writeoff}}能量值</li>
                    </ul>
                </div>
                <div class="show_data">
                    <div>评论：</div>
                    <ul ng-repeat="node in [obj[5].node[0]]">
                        <li> 每节课评论成功可获得{{node.med_comment}}能量值，如若输入文字可获得{{node.med_commentwithwords}}能量值 </li>
                    </ul>
                </div>
                <div class="show_data">
                    <div>运动：</div>
                    <ul>
                        <li ng-repeat="node in obj[6].node">每天运动{{node.med_motionminutes_start}}-{{node.med_motionminutes_end}}分钟，每1分钟可获得{{node.med_motion_per}}能量值（每日22:00统计） </li>
                    </ul>
                </div>
                <div class="show_data">
                    <div>充值：</div>
                    <ul>
                        <li ng-repeat="node in obj[7].node">一次性充值{{node.med_recharge_start}}-{{node.med_recharge_end}}元，每1元实收金额可获得{{node.med_recharge_per}}能量值 </li>
                    </ul>
                </div>
                <div class="show_data">
                    <div>购买课程：</div>
                    <ul>
                        <li ng-repeat="node in obj[8].node">一次性消费{{node.med_consume_start}}-{{node.med_consume_end}}元，每1元实收金额可获得{{node.med_consume_per}}能量值 </li>
                    </ul>
                </div>
            </div>
            <style media="screen" ui-bs>
                .show_data {position: relative;line-height: 30px;border-bottom: 1px dashed #e5e5e5;}
                .show_data:last-child{border-bottom: 0}
                .show_data b{font-size:14px;color:#333333;}
                .show_data > div {position: absolute;top: 0px;display: block;width: 120px;text-align: right;height: 60px;z-index: 100;line-height: 60px;}
                .show_data ul {list-style-type: none;padding:15px 0;min-height: 60px;}
                .show_data ul li { line-height: 30px; font-size: 14px; color:#333333; letter-spacing:0; text-align:left; padding-left: 180px; }
                .show_data.edit_data {}
                .show_data.edit_data > .i-switch {position: absolute;top: 21px;left: 130px;z-index: 200;background-color: #ea544a;}
                .show_data.edit_data ul li input{ text-align: center; height: 32px; margin: 0 5px;}
                .show_data.edit_data ul li input[w4]{ width: 40px;}
                .show_data.edit_data ul li input[w5]{ width: 50px;}
                .show_data.edit_data ul li input[w6]{ width: 60px;}
                .show_data.edit_data ul li select{ padding:0 0 0 5px; height: 32px; margin: 0 5px; border: 1px solid #E1E3E4;}
                .show_data.edit_data ul li select option{ text-align: center; }
                .show_data.edit_data ul li select[w4]{ width: 40px;}
                .show_data.edit_data ul li select[w5]{ width: 50px;}
                .show_data.edit_data ul li select[w6]{ width: 60px;}
                .show_data.edit_data ul li [add]{ color: #ea544a; cursor: pointer; }
                .show_data.edit_data ul li del{text-decoration: none; color:#ea544a; float: right; line-height: 33px;margin-right: 36px; cursor: pointer;}
            </style>
        </div>
        <div class="col-sm-4">
            <dc-json json="obj"></dc-json >
        </div>
    </div>
</div>
